<template>
	<div>
		<div>
		<el-card class="box-card" style="width: 86.8%;float: left;">
		  <div slot="header" class="clearfix" align="left">
					<span> 注册来源：
					 <el-select v-model="value" placeholder="请选择">
						<el-option
						  v-for="item in options"
						  :key="item.value"
						  :label="item.label"
						  :value="item.value">
						</el-option>
					  </el-select>
				  </span>
				  <span> 是否注册：
						 <el-select v-model="value" placeholder="请选择">
							<el-option
							  v-for="item in options"
							  :key="item.value"
							  :label="item.label"
							  :value="item.value">
							</el-option>
						  </el-select>
				  </span>
			<span style="float: right"> 手机号码：
			<el-input v-model="input" placeholder="请输入内容" style="width: 200px;"></el-input>
			<el-button type="primary" icon="el-icon-search" >搜索</el-button>
			
			</span>
		  </div>
		
		  
		
		
		
		 <el-table
		    :data="tableData"
		    border
		    style="width: 100%">
		    <el-table-column
		      fixed
		      prop="date"
		      label="日期"
		      style="width: 10%;">
		    </el-table-column>
		    <el-table-column
		      prop="name"
		      label="姓名"
		      style="width: 10%;">
		    </el-table-column>
		    <el-table-column
		      prop="province"
		      label="省份"
		     style="width: 10%;">
		    </el-table-column>
		    <el-table-column
		      prop="city"
		      label="市区"
		     style="width: 10%;">
		    </el-table-column>
		    <el-table-column
		      prop="address"
		      label="地址"
		     style="width: 20%;">
		    </el-table-column>
			<el-table-column
			  prop="address"
			  label="地址"
			  style="width: 20%;">
			</el-table-column>
			
		    <el-table-column
		      prop="zip"
		      label="邮编"
		      style="width: 10%;">
		    </el-table-column>
		    <el-table-column
		      label="操作"
		     style="width: 10%;">
		      <template slot-scope="scope">
		        <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
		        <el-button type="text" size="small">编辑</el-button>
		      </template>
		    </el-table-column>
		  </el-table>
		  </el-card>
			</div>
					  <div> <!-- 分页-->
						  <el-pagination
							background
							layout="prev, pager, next"
							:total="1000"
							style="float: right;margin-right:30%;margin-top: 20px;">
						  </el-pagination>
						</div>
				
	</div>
			
	
</template>

<script>
export default {
   data() {
        return {
			
          tableData: [{
            date: '2016-05-02',
            name: '王小虎',
            province: '上海',
            city: '普陀区',
            address: '上海市普陀区金沙江路 1518 弄',
            zip: 200333
          }, {
            date: '2016-05-04',
            name: '王小虎',
            province: '上海',
            city: '普陀区',
            address: '上海市普陀区金沙江路 1517 弄',
            zip: 200333
          }, {
            date: '2016-05-01',
            name: '王小虎',
            province: '上海',
            city: '普陀区',
            address: '上海市普陀区金沙江路 1519 弄',
            zip: 200333
          }, {
            date: '2016-05-03',
            name: '王小虎',
            province: '上海',
            city: '普陀区',
            address: '上海市普陀区金沙江路 1516 弄',
            zip: 200333
          },
		  {
		    date: '2016-05-03',
		    name: '王小虎',
		    province: '上海',
		    city: '普陀区',
		    address: '上海市普陀区金沙江路 1516 弄',
		    zip: 200333
		  },
		  {
		    date: '2016-05-03',
		    name: '王小虎',
		    province: '上海',
		    city: '普陀区',
		    address: '上海市普陀区金沙江路 1516 弄',
		    zip: 200333
		  }
		  
		  ],
		  options: [{
		            value: '选项1',
		            label: '黄金糕'
		          }]
				  
        }
      },
   methods: {
        handleClick(row) {
          console.log(row);
        }
      }
}
</script>




<style>

</style>
